$(function() {
	Date.prototype.Format = function(fmt) { //author: meizz   
		var o = {
			"M+": this.getMonth() + 1, //月份   
			"d+": this.getDate(), //日   
			"H+": this.getHours(), //小时   
			"m+": this.getMinutes(), //分   
			"s+": this.getSeconds(), //秒   
			"q+": Math.floor((this.getMonth() + 3) / 3), //季度   
			"S": this.getMilliseconds() //毫秒   
		};
		if(/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
		for(var k in o)
			if(new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
		return fmt;
	}
	var ws;
	
	if("WebSocket" in window) {
		// 打开一个 web socket
		ws = new WebSocket("ws://localhost:8080/ImServer/im");
		ws.onopen = function() {
			// Web Socket 已连接上，使用 send() 方法发送数据
			$.ajax({
				type:"post",
				url:"http://localhost:8080/ImServer/getOnlinUsers",
				success:function(datas){
					var usersHtml = template('im-users', {users:datas});
					$("#userList").html(usersHtml);
					$(".user").on("click",function(event){
						$("#im-btn-send").attr("send-user",$(this).attr("username"));
						$("#msg_title").html($(this).children("span").html());
					});
				}
			});
		};

		ws.onmessage = function(evt) {
			var received_msg = evt.data;
			now = new Date().Format("yyyy年MM月dd日 HH:mm:ss")
			var pushTemp = template('im-record-push', {
				time: now,
				img: "2.jpg",
				user:"城北徐公",
				msg: received_msg
			});
			pushTemp = pushTemp.replace(/&#60;/g, "<").replace(/&#62;/g, ">");
			$("#im-record").append(pushTemp);
			$("#im-record").parent().scrollTop($("#im-record").parent()[0].scrollHeight);
		};

		ws.onclose = function() {
			// 关闭 websocket
			//alert("连接已关闭...");
		};
	} else {
		// 浏览器不支持 WebSocket
		alert("您的浏览器不支持 WebSocket!");
	}
	layui.use("layer", function() {
		var layer = layui.layer;
		layer.open({
			type: 1, //弹出类型为1 页面层
			title: " ", //标题
			shade: false, //是否显示蒙层
			maxmin: true, //最大最小化窗口
			minCallback: function() {
				$(".layui-layer-title").first().css("background-color", "#F8F8F8");
				$(".layui-layer-title").first().css("border-color", "#EEE");
			},
			maxCallback: function() {
				$(".layui-layer-title").first().css("background-color", "transparent");
				$(".layui-layer-title").first().css("border-color", "transparent");
			},
			area: ['700px', '400px'], //初始宽高
			skin: "test-css", //添加自定义样式
			content: $("#im-view"), //弹出页面
			//拖拽窗口大小触发事件
			resizing: function(layero) {
			}

		});
	});
	/*
	  各项操作注册事件
	 */
	var sendMsgFun = function() {
		var sendMsg = document.getElementById("im-sendMsgText").value.replace(/\n/g, '<br>').replace(/\s/g, '&nbsp;');
		var sendUser = $("#im-btn-send").attr("send-user");
		if(sendMsg == "") {
			return;
		}
		if(sendUser==""){
			return;
		}
		var now = new Date().Format("yyyy年MM月dd日 HH:mm:ss");
		var msgTemp = template('im-record-send', {
			time: now,
			msg: sendMsg
		});
		msgTemp = msgTemp.replace(/&#60;/g, "<").replace(/&#62;/g, ">");
		$("#im-record").append(msgTemp);
		$("#im-sendMsgText").val("");
		$("#im-record").parent().scrollTop($("#im-record").parent()[0].scrollHeight);
		$.ajax({
			type: "post",
			url: "http://localhost:8080/ImServer/sendMsg",
			data: {
				sendUsername: sendUser,
				sendMsg: sendMsg
			}
		});
	}
	$("#im-btn-send").click(function() {
		sendMsgFun();
	});
	$("#im-sendMsgText").keydown(function(event) {
		if(event.ctrlKey && event.keyCode == 13) {
			sendMsgFun();
		}
	});
});